//
// Buttons
// --------------------------------------------------


// Customize styles
// --------------------------------------------------

.btn {
	outline: 0 !important;
    padding: 5px 15px;
    border-width: 2px;
    font-weight: 700;
    &:active,
    &.active {
        box-shadow: none;
    }
}

.btn-link {
    color: @text-muted;
    &:hover,
    &:focus,
    &:active {
        color: @text-color;
    }
}

// Button Sizes
// --------------------------------------------------

.btn-lg {
    padding: 9px 20px;
}
.btn-sm {
    padding: 4px 12px;
}
.btn-xs {
    padding: 0px 5px;
}

// Alternate buttons
// --------------------------------------------------

.btn-default {
    .button-variant(@text-color; @gray-lighter; @gray-lighter);
}
.btn-primary {
    .button-variant(@white-base; @brand-primary; @brand-primary);
}
.btn-success {
    .button-variant(@white-base; @brand-success; @brand-success);
}
.btn-info {
    .button-variant(@white-base; @brand-info; @brand-info);
}
.btn-purple {
    .button-variant(@white-base; @brand-purple; @brand-purple);
}
.btn-warning {
    .button-variant(@white-base; @brand-warning; @brand-warning);
}
.btn-danger {
    .button-variant(@white-base; @brand-danger; @brand-danger);
}
.btn-pink {
    .button-variant(@white-base; @brand-pink; @brand-pink);
}
.btn-black {
    .button-variant(@white-base; @black-lighter; @black-lighter);
}
// Button variants

.button-variant(@color; @background; @border) {
    color: @color;
    background-color: mix(@white-base, @background, 30%);
    border-color: darken(@border, 5%);
    &:focus,
    &.focus {
        color: @color !important;
        background-color: darken(@background, 10%) !important;
        border-color: darken(@border, 10%) !important;
    }
    &:hover {
        color: @color !important;
        background-color: darken(@background, 5%) !important;
        border-color: darken(@border, 5%) !important;
    }
    &:active,
    &.active,
    .open > .dropdown-toggle& {
        color: @color;
        background-color: darken(@background, 10%);
        border-color: darken(@border, 10%);
        &:hover,
        &:focus,
        &.focus {
            color: @color;
            background-color: darken(@background, 10%);
            border-color: darken(@border, 10%);
        }
    }
    &.disabled,
    &[disabled],
    fieldset[disabled] & {
        &,
        &:hover,
        &:focus,
        &.focus,
        &:active,
        &.active {
            background-color: @background;
            border-color: @border;
        }
    }
    .badge {
        color: @background;
    }
}


// Alternate outline buttons
// --------------------------------------------------

.btn-outline.btn-default {
    .outline-button-variant(@text-color, @gray-lighter);
}
.btn-outline.btn-primary {
    .outline-button-variant(@brand-primary, @brand-primary);
}
.btn-outline.btn-success {
    .outline-button-variant(@brand-success, @brand-success);
}
.btn-outline.btn-info {
    .outline-button-variant(@brand-info, @brand-info);
}
.btn-outline.btn-purple {
    .outline-button-variant(@brand-purple, @brand-purple);
}
.btn-outline.btn-warning {
    .outline-button-variant(@brand-warning, @brand-warning);
}
.btn-outline.btn-danger {
    .outline-button-variant(@brand-danger, @brand-danger);
}
.btn-outline.btn-pink {
    .outline-button-variant(@brand-pink, @brand-pink);
}
.btn-outline.btn-black {
    .outline-button-variant(@black-lighter, @black-lighter);
}

// Outline button variants
.outline-button-variant(@color, @border) {
    background-color: transparent;
    color: darken(@color, 5%);
    border-color: darken(@border, 5%);
}

// Alternate raised buttons
// --------------------------------------------------

.btn-raised.btn-default {
    .raised-button-variant(@gray-lighter);
}
.btn-raised.btn-primary {
    .raised-button-variant(@brand-primary);
}
.btn-raised.btn-success {
    .raised-button-variant(@brand-success);
}
.btn-raised.btn-info {
    .raised-button-variant(@brand-info);
}
.btn-raised.btn-purple {
    .raised-button-variant(@brand-purple);
}
.btn-raised.btn-warning {
    .raised-button-variant(@brand-warning);
}
.btn-raised.btn-danger {
    .raised-button-variant(@brand-danger);
}
.btn-raised.btn-pink {
    .raised-button-variant(@brand-pink);
}
.btn-raised.btn-black {
    .raised-button-variant(@black-lighter);
}

// Raised button variants
.raised-button-variant(@border) {
    box-shadow: 0 3px 0 0 darken(@border, 10%);
    &:focus,
    &.focus {
        box-shadow: 0 3px 0 0 darken(@border, 15%);
    }
}

// Rounded buttons
// --------------------------------------------------
.btn-rounded {
    border-radius: 100px !important;
}